<template>
  <div class="auction_bidding_details">
    <c-title :hide="false" :text="'参拍/委拍明细'"></c-title>
    <van-tabs v-model="active" title-active-color="#126F46" color="#126F46" @change="tabChange">
      <van-tab title="参拍明细" :title-style="active == '0' ? 'color:#126F46;font-weight: bold;font-size: 1.13rem;' : 'color:#000000;font-size: 1rem;font-weight: 400;'"></van-tab>
      <van-tab title="委拍明细" :title-style="active == '1' ? 'color:#126F46;font-weight: bold;font-size: 1.13rem;' : 'color:#000000;font-size: 1rem;font-weight: 400;'"></van-tab>
    </van-tabs>
    <div v-for="(item, ind) in list" :key="ind" @click="tapActive(item)">
      <bidding :detailsTag="active == '0' ? 'auction' : 'bidding'" :infoData="item" @cancelAuction="cancelAuction"></bidding>
    </div>
  </div>
</template>
<script>
import bidding from "./components/bidding.vue";
import { scrollMixin } from "utils/mixin";
export default {
  mixins: [scrollMixin],
  data() {
    return {
      active: "0",
      list: [],
      isLoadMore: true,
      page: 1,
      total_page: 0
    };
  },
  activated() {
    this.init();
    this.getData();
  },
  methods: {
    // 取消参拍
    async cancelAuction(e) {
      let json = {
        id: e.id
      };
      let { msg, result } = await $http.post("plugin.new-auction.frontend.auction.cancelAuction", json, ".");
      if (result) {
        this.$toast(msg);
        this.init();
        this.getData();
      } else {
        this.$toast(msg);
      }
    },
    tabChange() {
      this.init();
      this.getData();
    },
    init() {
      this.page = 1;
      this.total_page = 0;
      this.isLoadMore = true;
      this.list = [];
    },
    tapActive(item) {
      if (item.has_one_activity.status == 2) return;
      this.$router.push(this.fun.getUrl("new_auction_detail", { id: item.activity_id }));
    },
    async getData() {
      let urlstr = "plugin.new-auction.frontend.auction";
      if (this.active == "1") {
        urlstr = "plugin.new-auction.frontend.entrust";
      }
      let { data, msg, result } = await $http.post(urlstr, {}, "");
      if (result) {
        this.list = data.data;
        this.isLoadMore = true;
        this.total_page = data.last_page;
      } else {
        this.isLoadMore = false;
        this.$toast(msg);
      }
    },
    async getMoreData() {
      if (!this.isLoadMore) return;
      this.isLoadMore = false;
      if (this.page >= this.total_page) {
        return;
      } else {
        this.page += 1;
        let json = {
          page: this.page
        };
        let urlstr = "plugin.new-auction.frontend.auction";
        if (this.active == "1") {
          urlstr = "plugin.new-auction.frontend.entrust";
        }
        let { data, msg, result } = await $http.post(urlstr, json, "");
        this.isLoadMore = true;
        if (result) {
          this.list = this.list.concat(data.data);
        } else {
          this.page = this.page - 1;
          this.isLoadMore = false;
          this.$toast(msg);
        }
      }
    }
  },
  components: { bidding }
};
</script>
<style lang="scss" scoped>
.list {
  padding: 0.94rem;
  box-sizing: border-box;
  .lis {
    padding: 0.81rem 0.94rem 0.94rem 0.94rem;
    box-sizing: border-box;
    background: #ffffff;
    border-radius: 0.63rem;
  }
}
</style>
